Actions in Svelte allow you to attach reusable behavior to DOM elements using the use: directive. They are ideal for handling low-level DOM operations like event listeners, animations, or third-party library integrations.
An action is a function that receives the element as its first argument and optionally returns an object with a destroy method for cleanup.
Actions can accept parameters. The action function receives a second argument with the parameters and can implement an update method for reactive changes.
Use actions for DOM manipulations that cannot be handled with reactive Svelte syntax.
Clean up any event listeners or side effects in the
destroymethod.Leverage the
updatemethod for reactive parameters.Keep actions reusable and composable.